<template>
  <div class="checkErrorBill">
    <div class="tip">
      *异常状态描述:
      <span style="font-weight: bold;">{{statusMap[formInline.error_status]}}</span>
    </div>
    <div class="main">
      <el-form :inline="true" :model="formInline" class="demo-form-inline" label-width="80px">
        <el-form-item label="所属地区">
          <el-input :readonly="disabled" v-model="formInline.area_company" placeholder="所属地区"></el-input>
        </el-form-item>
        <el-form-item label="运单ID">
          <el-input :readonly="disabled" v-model="formInline.id" placeholder="运单ID"></el-input>
        </el-form-item>
        <el-form-item label="司机姓名">
          <el-input :readonly="disabled" v-model="formInline.sj_name" placeholder="司机姓名"></el-input>
        </el-form-item>
        <el-form-item label="手机号">
          <el-input :readonly="disabled" v-model="formInline.mobile_display" placeholder="手机号"></el-input>
        </el-form-item>
        <el-form-item label="车牌号">
          <el-input :readonly="disabled" v-model="formInline.cph" placeholder="车牌号"></el-input>
        </el-form-item>
        <el-form-item label="公司名称">
          <el-input :readonly="disabled" v-model="formInline.company_name" placeholder="公司名称"></el-input>
        </el-form-item>
        <el-form-item label="发货地">
          <el-input :readonly="disabled" v-model="formInline.ship_address" placeholder="发货地"></el-input>
        </el-form-item>
        <el-form-item label="收货地">
          <el-input :readonly="disabled" v-model="formInline.to_address" placeholder="收货地"></el-input>
        </el-form-item>
        <el-form-item label="接单时间">
          <!-- <el-input :readonly="disabled" v-model="formInline.add_time" placeholder="接单时间"></el-input> -->
          <el-date-picker 
          value-format="yyyy-MM-dd HH:mm:ss"
          :readonly="formInline.error_status != 1 && formInline.error_status != 2 && formInline.error_status != 3" 
          v-model="dateForm.add_time" 
          type="datetime" 
          placeholder="接单时间"></el-date-picker>
        </el-form-item>
        <el-form-item label="提货时间">
          <el-date-picker 
          value-format="yyyy-MM-dd HH:mm:ss"
          :readonly="formInline.error_status != 1 && formInline.error_status != 2 && formInline.error_status != 3" 
          v-model="dateForm.th_time" 
          type="datetime" 
          placeholder="提货时间"></el-date-picker>
          <!-- <el-input :readonly="disabled" v-model="formInline.th_time" placeholder="提货时间"></el-input> -->
        </el-form-item>
        <el-form-item label="卸货时间">
          <el-date-picker 
          value-format="yyyy-MM-dd HH:mm:ss"
          :readonly="formInline.error_status != 1 && formInline.error_status != 2 && formInline.error_status != 3" 
          v-model="dateForm.dd_time" 
          type="datetime" 
          placeholder="卸货时间"></el-date-picker>
          <!-- <el-input :readonly="disabled" v-model="formInline.dd_time" placeholder="卸货时间"></el-input> -->
        </el-form-item>
        <el-form-item label="审核时间">
          <el-input :readonly="disabled" v-model="formInline.check_time" placeholder="审核时间"></el-input>
        </el-form-item>
        <el-form-item label="运费单价">
          <el-input :readonly="disabled" v-model="formInline.unit_price" placeholder="运费单价"></el-input>
        </el-form-item>
        <el-form-item label="发货重量">
          <el-input :readonly="disabled" v-model="formInline.kg" placeholder="发货重量"></el-input>
        </el-form-item>
        <el-form-item label="卸货重量">
          <el-input :readonly="disabled" v-model="formInline.unloading_weight" placeholder="卸货重量"></el-input>
        </el-form-item>
        <el-form-item label="运费">
          <el-input :readonly="disabled" v-model="formInline.price" placeholder="运费"></el-input>
        </el-form-item>
      </el-form>
      <div class="tool" v-if="formInline.error_status == 1 || formInline.error_status == 2 || formInline.error_status == 3">
        <el-button class="btn" type="primary" @click="changeBill" v-if="formInline.is_transfer_order != 1">恢复</el-button>
      </div>
    </div>
  </div>
</template>

<script>
import {updateErrorBill} from "@/api/waybill";
export default {
  name: "CheckErrorBill",
  props: {
    billData: {
      type: Object,
      default: {}
    }
  },
  data() {
    return {
      disabled: true,
      statusMap: {
        1: "超过1小时待提货状态",
        2: "提货时间和卸货时间小于30分钟,此状态可以修改提货时间和卸货时间",
        3: "运输中状态超过5天",
        4: "超过90天未结算运单"
      },
      formInline: {},
      dateForm: {
        th_time: "",
        dd_time: "",
        add_time:""
      }
    };
  },
  mounted() {
    console.log("异常运单信息", this.billData);
    this.formInline = this.billData;
    this.dateForm.th_time = this.formInline.th_time;
    this.dateForm.dd_time = this.formInline.dd_time;
    this.dateForm.add_time = this.formInline.add_time;
    this.initial();
  },
  methods: {
    async initial() {},
    stringToTimestamp(dateString){
      // 使用Date对象解析日期字符串
      const date = new Date(dateString);
      // 检查日期是否有效
      if (isNaN(date)) {
          throw new Error('无效的日期格式');
      }
      // 获取时间戳（毫秒）
      return date.getTime();
    },
    async changeBill(){
      let th_timeStamp = this.stringToTimestamp(this.dateForm.th_time);
      let dd_timeStamp = this.stringToTimestamp(this.dateForm.dd_time);
      let add_timeStamp = this.stringToTimestamp(this.dateForm.add_time);
      if(add_timeStamp >= th_timeStamp){
        this.$message.error('接单时间必须小于提货时间');
        return;
      }
      if(th_timeStamp >= dd_timeStamp){
        this.$message.error('卸货时间必须大于提货时间');
        return;
      }
      //半小时间隔
      let halfHourSpace = 1000 * 60 * 30;
      if(dd_timeStamp - th_timeStamp < halfHourSpace){
        this.$message.error('提货时间和卸货时间间隔需大于30分钟');
        return;
      }
      // console.log('dateForm',this.dateForm);
      let result =await updateErrorBill({
        ...this.dateForm,
        id:this.formInline.id
      });
      if(result.code == 200){
        this.$message.success('恢复成功');
        this.$emit('refreshTable');
      }
    }
  }
};
</script>

<style lang="scss" scoped>
.checkErrorBill {
  .tip {
    color: $theme-Danger;
    margin-bottom: 10px;
    display: flex;
    justify-content: center;
  }
  .tool{
    display: flex;
    justify-content: center;
    .btn{
      width: 150px;
    }
  }
  .demo-form-inline {
    .el-form-item {
      width: 24%;
    }
    .el-input{
      width: 220px;
    }
  }
}
</style>
